<template>
  <view class="container">
    <view class="list-box">
      <view class="list-item-box"
            v-for="(item,index) in dataList"
            :key="index"
            @tap="goMajor(item.enrollUniversityId,item.year,item.batch)">
        <view class="list-item-label">{{item.batchShow}}（{{item.year}}年）</view>
        <view class="list-item-arrow">
          <image src="../../static/images/arrow.png"></image>
        </view>
      </view>

      <view class="noHave"
            v-if="isShowHave">
        暂无数据
      </view>
    </view>
  </view>
</template>

<script>
import { http } from '../../utils'

export default {
  data () {
    return {
      params: {
        id: '',
        year: '',
        batch: ''
      },
      isShowHave: false,
      total: 0,
      dataList: []
    }
  },
  onLoad (options) {
    this.params.id = options.id;
    this.fetchList(this.params);
  },
  methods: {
    fetchList (data) {
      http('/enrollment-plan/mtype',
        data, {
        hideLoading: false,
        hideMsg: true,
        method: 'POST'
      }).then(
        res => {
          this.total = res.data.total;
          this.dataList = res.data.data.list;

          if (this.dataList.length == 0) {
            this.isShowHave = true
          } else {
            this.isShowHave = false
          }
        }).catch(
          err => {
            console.error(err)
          })
    },
    goMajor (universityId, year, batch) {
      uni.navigateTo({
        url: '/pages/enrollment_plan_major/enrollment_plan_major?id=' + universityId + "&year=" + year + "&batch=" + batch
      })
    }

  }
}
</script>

<style>
page {
  background-color: #eeeeee;
}

.container {
  width: 750rpx;
  height: auto;
}

.list-box {
  background-color: #ffffff;
  width: 750rpx;
  height: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 20rpx;
  font-size: 28rpx;
}

.list-item-box {
  width: 690rpx;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  height: 90rpx;
  border-bottom: solid 1rpx #f5f5f5;
}

.list-item-arrow image {
  width: 20rpx;
  height: 20rpx;
}

.noHave {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #ccc;
  font-size: 32rpx;
  height: 48rpx;
}
</style>
